<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>用户注册</title>
    <style type="text/css">
        *{
            margin: 0px;
            padding: 0px;
        }
        html,body{
            width: 100%;
            height: 100%;
        }
        body{
            display: flex;
            justify-content: center;
            align-items: center;
        }
        #regist{
            width: 600px;
            display: flex;
            flex-direction: column;
        }
        header{

            border-bottom: 1px solid #ddd;
        }
        header span{
            margin-bottom: 30px;
        }
        a{
            text-decoration: none;
        }
        a:hover{
            color: red;
            font-weight:bolder;
        }
        #regist_01{
            margin-top: 30px;
        }
        #shouji{
            margin-bottom: 10px;
        }
        #shouji #span1{
            font-size: 15px;
        }
        #shouji #span2,#xieyi span,#submit span{
            font-size: 5px;
        }
        #mima #span3{
            font-size: 15px;
        }
        input{
            outline: none;
        }
        #shouji input,#mima input{
            width: 200px;
            height: 30px;
            border: 1px solid #666;
            border-radius: 5px;
            margin-bottom: 10px;
            box-sizing: border-box;
        }
        #jihuoma{
            width: 100%;
            margin-top: 10px;
        }
        #jihuoma span{
            margin-left: 15px;
            font-size: 15px;
        }
        #jihuoma input{
            width: 70px;
            height: 30px;
            border: 1px solid #666;
            border-radius: 5px;
            margin-bottom: 10px;
            box-sizing: border-box;
        }
        #jihuoma button{
            padding-left: 10px;
            padding-right: 10px;
            border: 1px solid #666;
            color: white;
            margin-left: 5px;
            background-color: cornflowerblue;
        }
        #submit button {
            padding: 5px;
            border: 1px solid #666;
            height: 30px;
            color: #FFFFFF;
            background-color: #FF4500;
        }
        #submit{
            width: 100%;
            margin-bottom: 20px;
        }
        #xieyi{
            width: 100%;
            margin-top: 5px;
            margin-bottom: 10px;
        }
        #regist_01{
            border-bottom: 1px solid #ddd;
        }
        footer{
            width: 100%;
            display: flex;
            justify-content: center;
            align-items: center;
            flex-direction: column;
            margin-top: 35px;
            font-size: 12px;
        }
        footer #a{
            margin-bottom: 10px;
        }
        #shouji{
            width: 100%;
        }
        #mima{
            width: 100%;
        }
        #regist_01{
            display: flex;
            justify-content: center;
            align-items: center;
            flex-direction: column;
        }
    </style>
</head>
<body>
<form id="regist_form" action="" method="get"></form>
<div id="regist">
    <header>
        <a href=""><span>账号注册</span></a>
    </header>
    <div id="regist_01">
        <div id="shouji">
            <span id="span1">手机号码</span>
            <input type="tel" form="regist_form" name="tel" id="tel"
            placeholder="请输入手机号码">
            <span id="span2">可用于激活码获取、密码找回、订单查询等</span>
        </div>
        <div id="mima">
            <span id="span3">登录密码</span>
            <input type="password" form="regist_form" name="pwd" id="pwd"
            placeholder="请输入登录密码">
        </div>
        <div id="jihuoma">
            <span>激活码</span>
            <input type="text" form="regist_form" name="text" id="text">
            <button type="button" form="regist_form">获取验证码</button>
        </div>
        <div id="xieyi">
            <input type="checkbox" form="regist_form" name="ids" value="1" checked>
            <span>我已阅读并同意遵守</span>
            <a href="">《用户服务协议》</a>
        </div>
        <div id="submit">
            <button type="submit" form="regist_form">同意协议并注册</button>
            <span>使用</span>
            <a href="">邮箱注册</a>
        </div>
    </div>
    <footer>
        <div id="a">
        <a href=""><span>投资者关系</span></a>|<a href=""><span>酒店加盟</span></a>|<a href=""><span>业务合作</span></a>|
        <a href=""><span>加入我们</span></a>|<a href=""><span>我要投诉</span></a>|<a href=""><span>安全中心</span></a>|
        <a href=""><span>AboutUs</span></a>
        </div>
        <div id="b">
        <span>Copright 2016 京ICP备0502 1530号 营业执照信息 保险经纪资质 客服电话10101216</span>
        </div>
    </footer>
</div>
</body>
</html>